/* pages/ticket/get/get.wxss */
.p-get {
    min-height: 100vh;
    background: linear-gradient(#00a9e9,#009ce3);
    background: -webkti-linear-gradient(#00a9e9, #009ce3);
    .top{
        position: relative;
        .banner-wrap{
            width: 100%;
            text-align: center;
            position: relative;
            .banner image {
                width: 100%;
                height: 716rpx;
            }
            .sub-title{
                padding: 0 4%;
                color: #01a8e4;
                line-height: 2;
                background-color: #fff242;
                border-radius: 999px;
                display: inline-block;
                position: absolute;
                top: 29%;
                left: 50%;
                transform: translateX(-50%);
                -webkit-transform: translateX(-50%);
            }
        }
        .go{
            position: absolute;
            bottom: -3%;
            right: 3%;
            image {
                width: 132rpx;
                height: 146rpx;
            }
        }
    }
    .tickets {
        padding-top: 25rpx;
        .ticket {
            width: 650rpx;
            height: 215rpx;
            color: rgba($color: #4c361f, $alpha: .7);
            margin: 0 auto 6%;
            background: url(/assets/ticketGet/ticket_bg.png) no-repeat;
            background-size: 100% 100%;
            border-radius: 20rpx;
            display: flex;

            .left {
                width: 66%;
                font-size: 20rpx;
                line-height: 1.5;
                padding: 35rpx 0 20rpx 30rpx;
                .name {
                    font-size: 30rpx;
                    color: #4c361f;
                    margin-bottom: 15rpx;
                    .strong {
                        color: #f33648;
                        line-height: 1;
                        margin-right: 10rpx;
                        font-size: 90rpx;
                    }
                }
                .address{
                    padding-right: 15rpx;
                    font-size: 18rpx;
                }
            }

            .right {
                width: 34%;
                display: flex;
                justify-content: center;
                align-items: center;

                .get {
                    font-size: 28rpx;
                    letter-spacing: 1px;
                    color: #fff;
                    padding: 12rpx 20rpx;
                    background: #f33648;
                    border-radius: 10rpx;
                    &.got{
                        opacity: .5;
                    }
                }
                .none{
                    text-align: center;
                    display: flex;
                    flex-wrap: wrap;
                    justify-content: center;
                    padding: 50rpx 0px 0px;
                    .dark{
                        font-size: 28rpx;
                        letter-spacing: 1px;
                        color: #4c361f;
                        margin-bottom: 35rpx;
                    }
                    .light{
                        font-size: 18rpx;
                        line-height: 1.5;
                    }
                }
            }
        }
    }

    .rules {
        padding: 28rpx 40rpx 100rpx;
        line-height: 1.8;
        font-size: 24rpx;
        color: rgba(255, 255, 255, .9);

        .title {
            font-size: 28rpx;
            margin-bottom: 32rpx;
            display: inline-block;
            background: rgb(255, 242, 14);
            color: rgb(0, 162, 230);
            padding: 0 4%;
            border-radius: 999px;
            line-height: 2;
        }
    }
}

.layer {
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, .5);
    position: fixed;
    top: 0;
    left: 0;

    .heart {
        width: 707rpx;
        height: 601rpx;
        text-align: center;
        background: #5da6fa;
        position: absolute;
        top: 50%;
        left: 50%;
        padding-top: 28%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        background: url(/assets/ticketGet/layer_bg.png) no-repeat;
        background-size: 100% 100%;

        .close {
            position: absolute;
            top: -10%;
            right: 10%;
        }

        .title {
            display: inline-block;
            font-size: 50rpx;
            font-weight: bolder;
            font-family: '微软雅黑';
            background-image: -webkit-gradient(linear, 0 0, 0 bottom, from(#fff3da), to(#ffdd92));
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .amount {
            width: 389rpx;
            height: 168rpx;
            margin: 20rpx auto 32rpx;
            font-size: 30rpx;
            font-weight: bolder;
            color: #f25228;
            background: #ffdd92;
            padding-top: 2%;
            background: url(/assets/ticketGet/layer_amount_bg.png) no-repeat;
            background-size: 100% 100%;

            text {
                font-size: 100rpx;
            }
        }

        .btn image {
            width: 281rpx;
            height: 74rpx;
        }
    }
}